@if (enabled && !loading) {

    <!-- Download button. -->
    @if (status === statusNotDownloaded) {
        <ion-button fill="clear" (click)="download($event, false)" @coreShowHideAnimation
            [ariaLabel]="(statusTranslatable || translates.notdownloaded) | translate: { name : statusSubject }">
            <ion-icon slot="icon-only" name="fas-cloud-arrow-down" aria-hidden="true" />
        </ion-button>
    }

    <!-- Refresh button. -->
    @if (status === statusOutdated || (status === statusDownloaded && !canTrustDownload)) {
        <ion-button fill="clear" (click)="download($event, true)" @coreShowHideAnimation
            [ariaLabel]="(statusTranslatable || translates.outdated) | translate: { name : statusSubject }">
            <ion-icon slot="icon-only" name="fam-cloud-refresh" aria-hidden="true" />
        </ion-button>
    }

    <!-- Downloaded status icon. -->
    @if (status === statusDownloaded && canTrustDownload) {
        <ion-icon class="core-icon-downloaded ion-padding-horizontal" color="success" name="fam-cloud-done"
            [attr.aria-label]="(statusTranslatable || translates.downloaded) | translate: { name : statusSubject }" role="status" />
    } @else if (status === statusDownloading) {
        <ion-spinner @coreShowHideAnimation
            [attr.aria-label]="(statusTranslatable || translates.downloading) | translate: { name : statusSubject }" />
    }

}

<!-- Spinner. -->
@if (loading) {
    <ion-spinner @coreShowHideAnimation [attr.aria-label]="translates.loading | translate: { name : statusSubject }" />
}
